<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>群测试数据</title>
<script src="${ctx}/static/js/aws/aws-sdk-2.428.0.min.js"></script>
<script src="${ctx}/static/js/jquery/jquery-1.8.3.min.js"></script>
<script src="${ctx}/static/js/im.js"></script>
<script>
var men =new Map();
var men1 =new Map();


Date.prototype.Format = function(fmt)   
{ //author: meizz   
var o = {   
		 "M+" : this.getMonth()+1,                 //月份   
		 "d+" : this.getDate(),                    //日   
		 "h+" : this.getHours(),                   //小时   
		 "m+" : this.getMinutes(),                 //分   
		 "s+" : this.getSeconds(),                 //秒   
		 "q+" : Math.floor((this.getMonth()+3)/3), //季度   
		 "S"  : this.getMilliseconds()             //毫秒   
		};   
		if(/(y+)/.test(fmt))   
		 fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));   
		for(var k in o)   
		 if(new RegExp("("+ k +")").test(fmt))   
		fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));   
		return fmt;   
		}

		var contactsMap=new Map();
		var baseUrl='${ctx}';
		IM.baseUrl = baseUrl;
		IM.onerror=function(data){
			console.log("im 处理失败");
		}
		IM.chatMessageHandler = function(message){
			console.log("chatMessageHandler:"+JSON.stringify(message));
			var type = message.type;
			if(type == 1 || type == 2){
				getGroupMenbers(message.toId);
				var crid = men.get(message.fromId);
				var name = crid.userName;
				var img = crid.userImage;
			}
			var content = message.content;
			
			if(type == 2){//图片
				var img ='<img height="20" width="20" src="'+content+'"></img>';
				content = img;
			}
			/*100	创建群消息
			 * 101	加入群消息
			 * 102	退出群聊
			 * 103	解散群 
			 * 104	移除群成员
			 * 105	更新群名称 */
			if(type==100){
				console.log("创建群："+JSON.stringify(message));
				var html = "<div id="+message.id+">";
				var obj = JSON.parse(message.content);
				var data = obj.groupMem;
				for ( var i in data) {
					if(data[i].userid==obj.owner){
						html+=data[i].userName+"创建了:"+obj.name+"群聊";
					}
				}
				html+="</div>";
				$("#content").append(html);
				getContacts();
			}
			if(type == 101){
				console.log("邀请群："+JSON.stringify(message));
				var html = "<div id="+message.id+">";
				var obj = JSON.parse(message.content);
				for ( var i in obj) {
					if(obj[i].change==1){
						var html = "<div id="+message.id+">";
						html+=message.fromId+"邀请了"+obj[i].userName+"加入该群";
						html+="</div>";
						$("#content").append(html);
					}
				}
				getContacts();
				getGroupMenbers(message.t);
			}
			if(type == 102){
				console.log("退出群："+JSON.stringify(message));
				var obj = JSON.parse(message.content);
				var obj1 = obj.groupMem;
				var html = "<div id="+message.id+">";
				html+=obj1[0].userName+"已退出该群";
				html+="</div>";
				$("#content").append(html);
			}
			if(type == 103){
				console.log("解散群："+JSON.stringify(message));
				var html = "<div id="+message.id+">";
				html+="该群已解散";
				html+="</div>";
				$("#content").append(html);
			}
			if(type == 104){
				console.log("移除群："+JSON.stringify(message));
				var obj = JSON.parse(message.content);
				for ( var i in obj) {
					if(obj[i].change==1){
						var html = "<div id="+message.id+">";
						html+=message.fromId+"移除了:"+obj[i].userName+"成员";
						html+="</div>";
						$("#content").append(html);
					}
				}
			}
			if(type == 105){
				console.log("更新群名称："+JSON.stringify(message));
				var obj = JSON.parse(message.content);
			}
			getContacts();
			getGroupMenbers(message.t);
			var html = "<div id="+message.id+">";
			html+=name+"说:"+content;
				html+="</div>";
			if(type==1 || type == 2){
				$("#content").append(html);
			}
		};
		IM.sysMessageHandler = function(message){
			console.log("sysMessageHandler:"+JSON.stringify(message));
			if(message.type == 1){//消息撤回
				var obj = message.content;
				$("#"+obj.msgid).text("对方撤回了消息");
			}
		};
		function revokeMessage(msgdiv){
			var msgid = $(msgdiv).attr("id");
			confirm("确认撤回"+msgid+"消息吗？？");
			IM.revokeMessage({
				msgid:msgid
			}).then(function(data){
				if(data.code == 1){
					$(msgdiv).text("你撤回了一条消息");
				}else{
					console.log("失败 code:"+data.code);
				}
			}).catch(function(data){
				console.log("发送失败");
			});
		}
var rid = null;

function link(){
	IM.wsConnect();
}
function login(){
	var phone = $("#login_username").val();
	var password = $("#login_pwd").val();
	var source = $("#login_source").val();
	IM.login({
		password:password,
		phone:phone,
		source:source
	}).then(function(data){
		if(data.code == 1){
			console.log("登录成功");
			IM.wsConnect();//好友获取完成之后,连接socket
		}else{
			console.log("失败 code:"+data.code);
		}
	}).catch(function(data){
		console.log("登录失败");
	});
}
function setMsgLable(crid){
	var obj = contactsMap.get(rid);
	var name = obj.name;
//	rid = obj.rid;
	rid = crid;
	$("#msgLabel").text("正在发送给:"+name);
	$("#msgLabel").attr("rid",rid);
}
function getContacts(){
	IM.getContacts().then(function(data){
		if(data.code == 1){
			console.log(data);
			var obj = data.obj;
			var chatnames = $("#chatnames");
			$("#chatnames").html("");
			var h1 = '<h1>联系人</h1>';
			chatnames.append(h1);
			for ( var i = 0; i <obj.length; i++){
				var image = obj[i].image;
				var name = obj[i].name;
				rid = obj[i].rid;
				contactsMap.set(rid,obj[i]);
				var html='<li style="cursor:pointer" onclick="setMsgLable('+rid+')">';
				html+='<input type="checkbox" class="ck" value=\"'+rid+'\">';
				html+='<img height="20" width="20" src="'+image+'"/>';
				html+='<span>'+name+'</span>';
				if(obj[i].ctype==2){
					getGroupMenbers(rid);
					html+='<button onclick="getGroupMenbers('+rid+')">获取群成员</button>';
					html+='<button onclick="inGroupMenbers('+rid+')">邀请群成员</button>';
					html+='<button onclick="useroutGroup('+rid+')">退出该群</button>';
					html+='<button onclick="revGroupMenbers('+rid+')">踢退出该群</button>';
				}
				html+='</li>';
				
				chatnames.append(html);
			}
			
		}else{
			console.log("失败 code:"+data.code);
		}
	}).catch(function(data){
		console.log("获取失败");
		console.log(data);
	});
}
function qx() {
	var ids=new Array();
	var i = 0;
	var ids1 = $(".ck:checked").map(function() {
		ids[i]=$(this).val();
		i++;
		return $(this).val();
	}).get().join(",");
	/* $.post(
		"${ctx}/im/createGroup",
		{"ids":ids,"xauthtoken":xauthtoken},
		function(obj) {
			console.log(JSON.stringify(obj))
		},"JSON"
	) */
	var params = {
			ids:ids
		}
	IM.createGroup(params).then(function(data) {
		if(data.code == 1){
			console.log(JSON.stringify(data));
			getContacts();
		}else{
			console.log("失败 code:"+data.code);
		}
	})
}
function useroutGroup(crid) {
	var params = {
			groupid:crid
		}
	IM.outGroup(params).then(function(data) {
		if(data.code == 1){
			getContacts();
			console.log(true)
		}else{
			console.log("失败 code:"+data.code);
		}
	})
}
function getGroupMenbers(crid) {
	IM.getGroupMen({
		groupid:crid
	}).then(function(data){
		var menbers = $("#menbers");
		var obj = data.obj;
		if(data.code == 1){
			console.log(data);
			menbers.html("");
				menbers.append("<h1>群聊成员</h1><br>");
				 men1.set(crid,obj);
			 for ( var i in obj) {
				 men.set(obj[i].userid,obj[i]);
				menbers.append(obj[i].userid+"->"+obj[i].userName+"<br>");
			 }
		}else{
			console.log("失败 code:"+data.code);
		}
	}).catch(function(data){
		console.log("获取失败");
	});
}
function inGroupMenbers(crid) {
	var ids=new Array();
	var i = 0;
	var ids1 = $(".ck:checked").map(function() {
		ids[i]=$(this).val();
		i++;
		return $(this).val();
	}).get().join(",");
	IM.inGroup({
		groupid:crid,
		ids:ids
	}).then(function(data){
		if(data.code == 1){
			console.log(true)
			
				for ( var i in ids) {
					var html = "<div id="+crid+">";
					html+="我邀请了"+ids[i]+"加入该群";
					html+="</div>";
					$("#content").append(html);
				}
			getContacts();
			getGroupMenbers(crid);
		}else{
			console.log("失败 code:"+data.code);
		}
	}).catch(function(data){
		console.log("获取失败");
	});
}
function revGroupMenbers(crid) {
	var ids=new Array();
	var i = 0;
	var ids1 = $(".ck:checked").map(function() {
		ids[i]=$(this).val();
		i++;
		return $(this).val();
	}).get().join(",");
	IM.removerGroup({
		groupid:crid,
		ids:ids
	}).then(function(data){
		if(data.code == 1){
			console.log(true)
			getGroupMenbers(crid);
		}else{
			console.log("失败 code:"+data.code);
		}
	}).catch(function(data){
		console.log("获取失败");
	});
}
function sendMsg() {
		var msg = $("#msg").val();
		IM.sendMsg({
			to:rid,
	    	content:msg,
	    	clientid:getClientid(),
	    	type:1,
	    	chatType:2
		}).then(function(data){
			if(data.code == 1){
				var html = '<div id='+data.obj.id+' style="cursor:pointer" onclick="revokeMessage(this)">';
				html+='我说:'+msg;
					html+='</div>';
				$("#content").append(html);
			}else{
				console.log("失败 code:"+data.code);
			}
		}).catch(function(data){
			console.log("发送失败");
		});
}
function addFriend(isReply) {
		var phone = $("#phone").val();
		IM.sendaddGoodFriend({
			phone:phone,
			isReply:isReply
		}).then(function(data){
			if(data.code == 1){
				console.log(JSON,stringify(data));
			}else{
				console.log("失败 code:"+data.code);
			}
		}).catch(function(data){
			console.log("发送添加好友请求失败");
		});
}
function getClientid() {
	 return (Math.random()*10000000).toString(16).substr(0,4)+'-'+(new Date()).getTime()+'-'+Math.random().toString().substr(2,5);
}
</script>
</head>
<body>
	<div id="login">
	
	<label>用户名</label><input id="login_username" type="text" />
	<label>密码</label><input id="login_pwd" type="text" /><br />
	<label>来源</label><input id="login_source" type="text" /><br />
	<button id="login_bt"  onclick="login()">登录</button><br />
	<button id="login_bt"  onclick="link()">连接websocket</button><br />
	<button onclick="getContacts()">点击获取联系人列表</button><br />
	<button onclick="getSession()">点击获取最近会话列表</button><br />
	<label id="msgLabel" for="msg">输入内容：</label>
	<input type="text" id="msg" style="width:400px;" />
    <input type="button" onclick="sendMsg()" value="发送消息" />
	<button id="login_bt"  onclick="qx()">建群</button><br />
	<button id="login_bt"  onclick=" addFriend(1)">添加好友</button><br />
	<button id="login_bt"  onclick=" addFriend(2)">拒绝</button><br />
	<button id="login_bt"  onclick=" addFriend(3)">同意</button><br />
</div>
<img src="${ctx}/im/generatingCode">
<div>
	<label>用户手机号：</label><input type="text" id="phone" style="width:400px;" />
</div>
<div id="contacts"></div>
	<div id="content" style="border: 2px;background-color: pink;width: 300px;height: 600px">
	<h1>聊天内容</h1>
	<p></p>
	</div>
	<div id="menbers" style="border: 2px;background-color: pink;width: 300px;height: 600px;list-style: 20px;">
	
	</div>
	<div id="chatnames" style="border: 2px;background-color: pink;width: 300px;height: 600px;list-style: 20px;">
	</div>
</body>
</html>